<template>
  <div>
    <bread class="filter">
      <h1>校管项目活动管理</h1>
      <div class="pull-right">
        <el-button size="small" type="primary" @click="createPro">+创建活动</el-button>
      </div>
    </bread>
    <pageContent hasPagination>
      <el-table
        :data="tableData"
        stripe
        style="width: 100%"
        header-row-class-name="custom-table-header-dark-gray">
        <template v-for="item in tableHead">
          <template>
            <el-table-column
              :label="item.cn"
              :key="item.en"
              :width="item.width">
              <template slot-scope="scope">
                <div>
                  {{scope.row[item.en]}}
                </div>
              </template>
            </el-table-column>
          </template>
        </template>
        <el-table-column
          label="操作"
          width="200"
          fixed="right">
          <template slot-scope="scope">
            <router-link to="/index/project-management/details/id/91">查看申报情况</router-link>
            <el-dropdown class="cur_select">
              <span class="el-dropdown-link main-text">
                更多<i class="el-icon-arrow-down el-icon--right"></i>
              </span>
              <el-dropdown-menu slot="dropdown">
                <el-dropdown-item class="main-text">编辑专家</el-dropdown-item>
                <el-dropdown-item class="main-text">添加备注</el-dropdown-item>
                <el-dropdown-item class="error-text">终止活动</el-dropdown-item>
              </el-dropdown-menu>
            </el-dropdown>
          </template>
        </el-table-column>
      </el-table>
    </pageContent>

    <pagination
      :total="total"
      :page-size="pageSize"
      @changePage="fetchData">
    </pagination>
  </div>

</template>

<script>
import pagination from 'components/pagination';
import NormalFilter from 'components/NormalFilter';
import PopFilter from 'components/PopFilter';

export default {
  name: 'hello',
  data () {
    return {
      tableHead: [
        {
          cn: '项目招标名称',
          en: 'a',
        },
        {
          cn: '申报截止时间',
          en: 'b',
          width: '120'
        },
        {
          cn: '状态',
          en: 'c',
          width: '100'
        },
        {
          cn: '申报人数',
          en: 'd',
          width: '100'
        },
        {
          cn: '专家目录',
          en: 'e',
          width: '300'
        },
        {
          cn: '评审截止日期',
          en: 'f',
          width: '120'
        },
        {
          cn: '备注',
          en: 'g',
        },
      ],
      tableData: [
        {
          a: '中国语言文学系',
          b: '2018/3/3',
          c: '申报中',
          d: '50',
          e: '专家1、专家2、专家3、专家4、专家5、专家6、专家7、专家6…',
          f: '2018/3/3',
          g: '-',
          h: '2018-04-24',
          i: '与去年相比有所增加',
          j: '生命科学学院',
          k: '李泽楷，王丽娜（学）',
        },
        {
          a: '社会学与人类学学院',
          b: '2018/3/3',
          c: '申报中',
          d: '47',
          e: '专家1、专家2、专家3、专家4、专家5、专家6、专家7、专家6…',
          f: '2018/3/3',
          g: '600',
          h: '2018-04-19',
          i: '加强高水平成果产出',
          j: '生命科学学院',
          k: '李泽楷，王丽娜（学）',
        },
      ],
      total: 1000,
      pageSize: 30,
      filters: {
        dataset: [{txt: '全部', val: '0'}, {txt: '中文成果', val: '1'}, {txt: '英文成果', val: '2'}],
        text: '语言'
      },
      statusFilterOptions: [{txt: '全职', val: '3'}, {txt: '兼职', val: '2'}, {txt: '退休', val: '1'}],
    }
  },
  methods: {
    createPro(){
      this.$router.push('/index/intramural-project/project-create')
    },
    getColumnWidth(item) {
      switch (item.en) {
      case 'b':
      case 'd':
      case 'e':
      case 'f':
      case 'g':
        return 100;
      case 'h':
        return 120;
      }
    },
    fetchData(page) {
      // console.log(page);
    },
    openMessageBox() {
      this.$confirm('点击确认后，将向学院管理员发送考核提交提醒通知。', '提醒学院提交考核', {
        confirmButtonText: '确定',
        cancelButtonText: '取消',
      }).then(() => {
        this.$message({
          type: 'success',
          message: '删除成功!'
        });
      }).catch(() => {
        this.$message({
          type: 'info',
          message: '已取消删除'
        });
      });
    },
    handleLanguage() {

    },
    handlePopChange() {

    },
  },
  components: {
    pagination,
    NormalFilter,
    PopFilter
  }
};
</script>
<style scoped lang="scss">
  .primary-color {
    color: var(--success-color);
  }
  .cur_select {
    margin-left: 20px;
  }
</style>
